<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <button>点击</button>
    <script>

        // call
        const obj = {
            uname: 'pink'
        }
        function fn(x, y) {
            console.log(this);
            console.log(x + y);
        }
        // call改变this 指向 也可传参
        fn.call(obj, 1, 2)  //简单数据


        // apply 
        const o = {
            age: 18
        }
        function fu(a, b) {
            console.log(this);
            console.log(a + b);

        }
        fu.apply(o, [1, 2])  //必须要用数组  返回值 本身就是在调用函数，所以返回值就是函数的返回值


        // const max = Math.max(1, 2, 3)
        // console.log(max);
        const arr = [100, 44, 28]
        const max = Math.max.apply(Math, arr)
        const min = Math.min.apply(null, arr)
        console.log(max, min);
        console.log(Math.max(...arr));



        // bind 重点
        const obj1 = {
            age: 19,
        }
        function fo() {
            console.log(this);
        }
        //1.bind 不会调用函数
        //2.能改变this指向
        //3.返回值是个函数 ， 但是这个函数里面的this是更改过的
        const funo = fo.bind(obj1)
        funo()


        document.querySelector('button').addEventListener('click', function () {
            this.disabled = true
            setTimeout(function () {
                // 原来的this指向改为button
                this.disabled = false
            }.bind(this), 2000)
        })
    </script>
</body>

</html>